<template>
	<div class="incircle">
		<!-- <so-header :seller="headerTitle"></so-header> -->
    <setHeader></setHeader>
    <div class="pagecontent" style="background-color: #fff;">
      <h3 class="mt-notice-in">该圈子已存在</h3>
      <div :class="avatar" class="circle-avatar"> 
        <img :src="info.img"/>
      </div>
      <p class="circle-title">{{circleTitle}}</p>
      <!-- <mt-button type="default" class="el-long-button el-long-create-button" @click="Join">申请加入</mt-button> -->
      <div class="btn_big_red" @click="Join" style="margin-top: 0.9rem;">
          <button>申请加入</button>
      </div>
      <p style="margin-top:0.3rem; color:#e50838; font-size: 0.28rem;" @click="JumpWay">为什么要加入圈子？</p>
      <!-- <so-footer :user="fill"></so-footer> -->
      <!-- <mt-popup
          v-model="popupVisible"
          position="bottom">
          <ul> 
            <li v-for="(list, i) in UcompanyList" @click="JoinCirlce(list.name,list.id)" :key="i">{{list.name}}</li>
          </ul>
      </mt-popup> -->
    </div>
	</div>
</template>
<script>
import setHeader from '../public/setHeader.vue';
import soFooter from '../public/nav.vue';
import { MessageBox } from 'mint-ui';


export default {
	data() {
      return {
        circlename: '',
        userInfo:'',
        headerTitle:'创建圈子',
        circleTitle:'',
        avatar:'circle-avatar-one ',
        CompanyList:'',
        info:'',
        popupVisible:false,
        UcompanyList:'',
        addCircle: {
          cid: '',
          cp_id: ''
        }
      };
    },
    components: {
		setHeader,
		soFooter
  },
    created() {
      let that = this;
      that.userInfo = window.localStorage.getItem('userInfo');
      that.userInfo = JSON.parse(that.userInfo);
      //获取当前用户的所绑定的企业信息
      that.getThisUcompanyList(that.userInfo.uid);
    },
    mounted() {
      // let that = this;
      //   var user = Promise.resolve(this.getUserInfo())
      //   user.then(
      //   function (result) { 
      //     that.userInfo = result;
      //   //获取当前用户的所绑定的企业信息
      //   that.getThisUcompanyList(result.uid);
      // })
    this.addCircle.cid = this.$route.query.paicheNo;
    this.addCircle.cp_id = window.localStorage.getItem('cpId');
        //获取当前圈子信息
        this.getThisCircleInfo();
    },
    methods:{
    	
    //获取圈子信息
      getThisCircleInfo:function(){
        let that = this;
        this.$fetch(this.$path+'/api.php/Circle/getCircleInfo',{cid:that.addCircle.cid})
          .then((res) => {
          	console.log(res);
            if(res.code == 200){
              that.info = res.data;
              that.circleTitle = res.data.c_name;
            }    
          });
      },
      //跳转
      JumpWay:function(){

      },
      //申请加入
      Join() {
        this.$router.push({
          path: '/JoinCircle',
          query: this.addCircle
        })
      },
      //获取用户绑定的企业
      getThisUcompanyList:function(userId){
        let that = this;
        this.$fetch(that.$path+'/api.php/company/getUserAllCompanyList',{userId:userId})
        .then((res) => {
          if(res.data.count < 1){
            that.UcompanyList = '';
          }else{
            that.UcompanyList = res.data.list;
          }
        })
      },

      //加入圈子申请
      // JoinCirlce:function(event,ch_id){
      //   let that = this;
      //   // that.popupVisible = false;
      //   let cid = that.addCircle.cid;
      //   // let uid = that.userInfo.uid;
      //   // let cp_id = ch_id
      //   that.addCircle.cp_id = window.localStorage.getItem('cpId');
      //   if(cid ==''){
      //      MessageBox.alert('请选择您所代表的企业');
      //      return false;
      //   } 
      //     that.$fetch(
      //       that.$path+'/api.php?s=/Circle/circleJoin', that.addCircle)
      //     .then((res) => {
      //       if(res.code == 200){
      //         that.$router.push({
      //           path: '/circleApplication',
      //           query: that.addCircle
      //         })
      //     // MessageBox.alert('申请成功,等待审核').then(action => {
      //     //             that.$router.push('/userCenter');
      //     // });
               
      //       }else{
      //         MessageBox.alert(res.msg);
      //       }
                  
      //     })
      // },
      
    }
}

</script>

<style >
.el-long-create-button{
	margin-top:50px;
}
.circle-avatar{
	width:1.1rem;
	height:1.1rem;
	margin:auto;
  border-radius: 4px;
  margin-bottom: 0.3rem;
}
.circle-avatar-one img{
	width:100%;
	height:100%;
}
.circle-title{
  font-size: 0.34rem;
  color: #333;
}
.circle-avatar-two img{
	width:49%;
	float:left;
	margin-top: 30px;
	margin-left:1%;
}
.circle-avatar-three img{
	width:49%;
	float:left;
	margin-left:1%;
}
.circle-avatar-four img{
	width:48%;
	float:left;
	margin-top: 2%;
	margin-left:2%;
	height: 48%;
}
.mt-notice-in{
    margin: 0.4rem 0 0.84rem;
    font-size: 0.32rem;
    font-weight: 400;
}

/* 头部样式 */
.incircle .header_array_text_white {
  background-color: #fff;
  color: #000;
}

</style>